<template>
  <a-drawer v-model:open="visible" title="抄送人设置" placement="right" width="600px" :footer-style="{ textAlign: 'right' }">
    <h4 style="margin-bottom: 20px;">请选择该节点的抄送人</h4>
    <a-card size="small">
      <a-checkbox-group v-model:value="checkboxGroup" :options="options" />
    </a-card>
    <template #footer>
      <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
      <a-button type="primary" @click="onClose">确认</a-button>
    </template>
    <div style="margin-top: 20px;">
      <a-checkbox v-model:checked="checked">允许发起人添加抄送人</a-checkbox>
    </div>
  </a-drawer>
</template>
<script setup>
  import { ref, watch, computed, reactive } from 'vue';
  import { useFlowDesignerStore } from '/@/store/modules/flowable';
  let store = useFlowDesignerStore();
  let { setCopyerConfig, setCopyer } = store;
  const checkboxGroup = ref([]);
  const checked = ref(false);
  const options = [
    { label: '指定成员', value: '1' },
    { label: '角色', value: '2' },
    { label: '管理员', value: '3' },
    { label: '直属主管', value: '5' },
    { label: '部门主管', value: '6' },
  ];
  let copyerDrawer = computed(() => store.copyerDrawer);
  let visible = computed({
    get() {
      return copyerDrawer.value;
    },
    set() {
      closeDrawer();
    },
  });
  const closeDrawer = () => {
    setCopyer(false);
  };
</script>
<style lang="css" scoped></style>
